<template>
    <section>
        <el-radio-group v-model="radioTab" size="mini" style="margin-bottom: 4px;" >
            <el-radio-button label="5">尺寸表</el-radio-button>
            <el-radio-button label="6">工艺单</el-radio-button>
            <el-radio-button label="8">技术文件</el-radio-button>
            <el-radio-button label="9">物料清单</el-radio-button>
            <el-radio-button label="10">大货BOM</el-radio-button>
            <el-radio-button label="11">绣花BOM</el-radio-button>
        </el-radio-group>
        <el-table :header-cell-style="{ background: '#F3F4F7', color: '#555' }" :data="data" :max-height="height-30" size="mini" v-loading="loading">
            <el-table-column prop="createtime" label="操作时间" width="200"></el-table-column>
            <el-table-column prop="username" label="操作人" width="100"></el-table-column>
            <el-table-column prop="content" label="操作记录" width="150" show-overflow-tooltip>
                <template slot-scope="{ row }">
                    <span>{{row.content}}</span>
                    <el-popover v-if="row.data" placement="right-start" width="600" trigger="click">
                        <div style="overflow-y: auto" :style="{'max-height': height+'px'}">
                            <jsonview :json="JSON.parse(row.data)"></jsonview>
                        </div>
                        <el-button type="text" slot="reference" size="mini">
                            <i class="el-icon-document"></i>
                        </el-button>
                    </el-popover>
                </template>
            </el-table-column>
            <el-table-column label="" align="center"></el-table-column>
        </el-table>
    </section>
</template>

<script>
import jsonview from "../../components/jsonview";
import {operateList} from "../../../api/log/log";

export default {
    name: "designLog",
    components:{jsonview},
    props: {
        style_id: {
            type: Number,
            default: 0
        },
        type_no: {
            type: String,
            default: ""
        },
        height: {
            type: Number,
            default: 0
        },
        isEdit:{
            type: Number,
            default: 0
        }
    },
    filters: {

    },
    data() {
        return {
            data: [],
            page: 1,
            limit: 20,
            total: 0,
            selectIndex: 0,
            btnLoading: false,
            loading: false,
            user: {},
            nodeActions: [],
            radioTab: '5',

            lockLoading: false,
        }
    },
    created() {
        this.user = this.$store.getters.user;
        this.nodeActions = this.user.node_actions[this.$route.meta.id] ? this.user.node_actions[this.$route.meta.id] : [];
    },
    watch:{
        radioTab(newValue, oldValue){
            this.getData();
        },
        type_no(newValue, oldValue){
            this.getData();
        }
    },
    methods: {
        //获取数据
        getData() {
            let param = {
                page: this.page,
                limit: this.limit,
                type: this.radioTab,
                type_no: ['9', '10', '11'].includes(this.radioTab) ? this.style_id : this.type_no
            };
            this.loading = true;
            operateList(param).then((res) => {
                this.loading = false;
                this.total = res.data.total;
                this.data = res.data.data;
            }).catch(() => {
                this.loading = false;
            });
        },
    },
    mounted() {
        this.getData();
    }
}
</script>

<style scoped>

</style>
